<template>
	<div class="stationauth">
		<van-nav-bar :title="title" fixed left-arrow @click-left="back" />
		<div class="content">
			<div class="list">
				<div class="title">身份证号</div>
				<van-cell-group>
					<van-field v-model="value" placeholder="单行输入" :border='false' />
				</van-cell-group>
			</div>

			<div class="list">
				<div class="title" style="margin-bottom: 2.06rem;">身份证图片</div>
				<van-uploader :after-read="afterRead" :max-count="1" style="width: 100%;margin-bottom: 1.5rem;">
					<p class="idcard"><img :src="positive" alt=""></p>
				</van-uploader>
				<van-uploader :after-read="afterReads" :max-count="1" style="width: 100%;">
					<p class="idcard"><img :src="nagetive" alt=""></p>
				</van-uploader>
			</div>
			<div class="list">
				<div class="title" style="margin-bottom: 1.8rem;">站长职业认证</div>
				<van-radio-group v-model="radio">
					<van-radio name="1" checked-color="#FE7700">当地政府证明</van-radio>
					<van-radio name="2" checked-color="#FE7700">营业执照</van-radio>
					<van-radio name="3" checked-color="#FE7700">单位组织证明</van-radio>
					<van-radio name="4" checked-color="#FE7700">房屋产权证书</van-radio>
				</van-radio-group>
				<p class="align">
					<van-uploader :after-read="afterRead" v-model="fileList" :max-count="1" />
				</p>
				
			</div>
			
			<div class="list">
				<van-radio-group v-model="radio1">
					<van-radio name="1" checked-color="#FE7700" style="width: 100%;">我保证以上信息真实性并接受（网站管理备案审查）</van-radio>
				</van-radio-group>
			</div>
		</div>
		<div class="button-sub">
			<van-button type="primary" block color="#FE7700" round>您已通过审核</van-button>
		</div>
	</div>
</template>

<script>
	import positive from "@/assets/img/positive.png"
	import nagetive from "@/assets/img/nagetive.png"
	export default {
		name: "StationAuth",
		components: {},
		data() {
			return {
				title: this.$route.query.title,
				value: '',
				messages: '',
				fileList: [],
				positive: positive,
				nagetive: nagetive,
				radio:"4",
				radio1:"1"
			}
		},
		mounted() {

		},
		methods: {
			back() {
				this.$router.go(-1)
			},
			afterRead(file) {
				this.positive = file.content
			},
			afterReads(file) {
				this.nagetive = file.content
			}

		}


	}
</script>

<style lang="less">
	.stationauth {
		padding-top: 46px;

		.van-nav-bar {
			.van-icon {
				color: #000;
			}
		}
		.button-sub{
			width: 16.56rem;
			margin: 3.28rem auto;
		}
		.van-button{
			height: 3.06rem;
			font-size:0.94rem;
			font-family:PingFang SC;
			font-weight:500;
			color:rgba(255,255,255,1);
			line-height: 3.06rem;
		}

		.content {
			margin-top: 0.59rem;
			background: #fff;
			padding: 1.75rem 1.81rem;

			.list {
				margin-bottom: 1.47rem;

				.title {
					font-size: 0.88rem;
					font-family: PingFang SC;
					font-weight: 500;
					color: rgba(74, 74, 74, 1);
					margin-bottom: 0.84rem;
				}

				.van-uploader__input-wrapper {
					width: 100%;
				}

				.idcard {
					width: 100%;
					display: flex;
					justify-content: center;

					img {
						width: 12.5rem;
						height: 9rem;
						object-fit: contain;
					}
				}

				.van-cell {
					width: 17.06rem;
					height: 2.56rem;
					border: 1px solid rgba(191, 191, 191, 1);
					border-radius: 0.5rem;
					line-height: 1;
				}

				.van-hairline--top-bottom::after,
				.van-hairline-unset--top-bottom::after {
					display: none;
				}
				.van-radio-group{
					display: flex;
					justify-content: space-between;
					align-items: center;
					flex-wrap: wrap;
					.van-radio{
						width: 50%;
						margin-bottom: 1.63rem;
						
						
					}
					.van-radio__label{
						font-size:0.88rem;
						font-family:PingFang SC;
						font-weight:500;
						color:rgba(131,131,131,1);
					}
				}
				.align{
					width: 100%;
					display: flex;
					justify-content: center;
				}
			}
		}
	}
</style>
